<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style type="text/css">
			*{
				padding: 0;
				margin: 0;
				text-decoration: none;
				list-style: none;
				font-size: 12px;
			}
			input{
	              border: 1px solid black;
			}
			a{
				color:#cecece ;
			}
			#wrapper-first{
				height: 32px;
				border-bottom: 1px solid #dcdcdc;
				color: #cccccc;
			}
			.first-p{
				float: left;
				line-height: 30px;
			}
			#wrapper-first-wrapper{
				height: 30px;
				margin: 0 auto;
				width: 1200px;
			}
			#wrapper-first-wrapper-first{
				height: 30px;
				float: right;
			}
			.first-ul>li{
				float: left;
				line-height: 30px;
				margin-left: 18px;
			}
			.first-list1{
				display: none;
				border: 1px solid #DCDCDC;
				border-top: none;
				margin-top: 2px;
				width: 60px;
				padding: 4px 10px 10px 10px;
				z-index: 1;
			}
			.first-list2{
				display: none;
				border: 1px solid #DCDCDC;
				border-top: none;
				margin-top: 2px;
				width: 60px;
				padding: 4px 10px 10px 10px;
				z-index: 1;
			}
			.spacial{
				position: relative;
				width: 66px;
			}
			#first-list1 > a{
				display: block;
				margin-top: 5px;
				height: 20px;
			}
			.login{
				text-align: center;
			}
			.div{
			    width: 0;
			    height: 0;
			    border: 5px solid transparent;
			    border-top-color:#CECECE;
			    position: absolute;
			    left: 60px;
			    top: 12px;
                }
              .imgi{
              	width: 140px;
              	display: none;
              }  
              .first-download{
              	display: inline-block;
              }
              
              
              #wrapper-second{
              	height: 65px;
              }
              #wrapper-second-img{
              	width: 260px;
              	height: 55px;
              	float: left;
              	display: block;
              }
              #wrapper-second-list{
              	float: left;
              	width: 750px;
              	height: 53px;
              	margin-left: 20px;
              	overflow: hidden;
              }
              form{
              	width: 378px;
              	height: 32px;
              	float: left;
              }
              .search-text{
              	width: 285px;
              	height: 32px;
              	border: 1px solid red;
              	float: left;
              }
              .search{
              	padding: 0 12px;
			    margin: 0;
			    width: 80px;
			    height: 34px;
			    line-height: 32px;
			    text-align: right;
			    font-family: "微软雅黑", "宋体", "verdana";
			    font-size: 14px;
			    color: #fff;
			    background: #d51819;
              }
              #list{
              	width: 380px;
              	height: 34px;
              	margin-top: 10px;
              }
              #listchoose{
              	float: right;
              	width: 305px;
              	height: 53px;
              	margin:0 auto;
              }
              span{
              	display: inline-block;
                 padding: 0 10px ;
              }
              #listchoose>li{
              	float:left;
              	line-height: 53px;
              	margin-right: 10px;
              	text-align: left;
              }
 		</style>
	</head>
	<body>
		<div id="wrapper-first">
			<div id="wrapper-first-wrapper">
				<p class="first-p">欢迎来到邦购网，全场实购满99元包邮</p>
				<div id="wrapper-first-wrapper-first">
					<ul class="first-ul">
						<li>
							<p class="login">登录</p>
						    <div class="first-list1">
								<a href="http://bgact.banggo.com/Unionlogin/Authorize?from=qq">QQ登录</a>
								<a href="http://bgact.banggo.com/Unionlogin/Authorize?from=alipay">微信登录</a>
								<a href="http://m.banggo.com/Api/wxLogin">支付宝登录</a>
							</div>
						</li>
						<li>注册</li>
						<li class="spacial">
							<p class="login1">我的邦购 <div class="div"></div></p>
							<div class="first-list2">
								<a href="http://user.banggo.com/member/Order">我的订单</a>
								<a href="http://user.banggo.com/member/Point">我的积分</a>
								<a href="http://user.banggo.com/member/Collect">我的点赞</a>
								<a href="http://user.banggo.com/member/Address">收货地址</a>
							</div>
						</li>
						<li>会员中心 </li>
						<li class="spacial"><b style="width:9px;height:10px;background:url('http://s.banggo.com/pub7/images/mbshop/common/Iphone-vertical.png') 0 0 
							no-repeat;padding-right:12px;"></b><p class="first-download">下载APP</p><div class="div"></div>
							<div><img class="imgi" src="http://s.banggo.com/pub1/bgweb/default/images/mbshop_pic_mobile.png"/></div>
							</li>
						<li>微博</li>
						<li>微信</li>
					</ul>	
				</div>
			</div>
		</div>
        <div id="wrapper-second">
        	<div id="wrapper-second-wrapper">
        		<div id="wrapper-second-img">
        			<a  style="width:230px;height:55px;float:left;overflow:hidden" href="http://www.banggo.com">
        				<img style="margin-top: -10px; margin-left: -23px; display: block; opacity: 1;" src="http://s.banggo.com/pub7/images/mbshop/newImg/mbshop_new_logo2.png"/>
        			</a>
        		</div>
        		<div id="wrapper-second-list">
        			<form  action="" method="post">
        				 <div id="list">
        				 	<input type="text" name="" class="search-text" value="" />
        				 	<input type="submit" class="search" value="搜索"/>
        				 </div>
        			</form>
        			<ul id="listchoose">
        				<li>毛衣<span>|</span></li>
        				<li>夹克<span>|</span></li>
        				<li>休闲裤<span>|</span></li>
        				<li>卫衣<span>|</span></li>
        				<li>羽绒服</li>
        			</ul>
        		</div>
        		<div id="wrapper-second-right">
        			
        		</div>
        	</div>
        </div>












<script type="text/javascript" src="js/jquery-1.11.3.js" ></script>
		<script type="text/javascript">
			var c = 0;
			$('.login').click(
			function(){
				c++;
				if(c%2==0)
				{
					$('.first-list1').css("display","none");
				}
				else{
					$('.first-list1').css("display","block");
				}
			}
			);
			$('.login1').click(
			function(){
			    c++;
				if(c%2==0){
					$('.first-list2').css("display","none");
				}else{
					$('.first-list2').css("display","block");
				}
			}
			);
			$('.first-download').click(function(){
				c++;
				if(c%2==0){
					$('.imgi').css("display","none");
				}else{
					$('.imgi').css("display","block");
				}
			})
		</script>
	</body>
</html>
